import React, {PureComponent} from 'react';
import {ButtonComp, QueryTable, GlobalProvider, MultiActModal, filterCodes, DataStatus, TaskProgress} from 'jh-lib';
import ComponentType from "../../Config/ComponentType";
import {Button} from "antd";
import {QueryFilter, sleepFunc} from "jh-utils";

const activityData = {
    "appCode": "EXPENSE_REIMBURSEMENT",
    "appName": "员工费用报销",
    "javaType": "com.jianhui.expense.reimbursement.domain.ExpenseReimbursement",
    "count": 10,
    "details": [
        {"taskCode": "bpm0022c085", "taskName": "部门审批", "count": 1},
        {"taskCode": "bpm0a85930f", "taskName": "部长审批", "count": 1},
        {"taskCode": "bpm3d902ffc", "taskName": "财务审批", "count": 1},
        {"taskCode": "bpm3ff5ee85", "taskName": "费用填报", "count": 5},
        {"taskCode": "bpmbeb0042e", "taskName": "销售组长审批", "count": 2}
    ]
};

const compData = [
    {id: '1', name: '测试1'}, {id: '2', name: '测试2'}, {id: '3', name: '测试3'}, {id: '4', name: '测试4'},
];

const request = {
    reqGet: (api, data) => {
        if (api === '/api/fsm/kan_ban/find_conf') {
            return new Promise((resolve, reject) => {
                setTimeout(() => {

                    resolve({
                        status: 200, data: [
                            {
                                id: 100,
                                name: 'todo',
                                acceptIds: [200],
                            },
                            {
                                id: 200,
                                name: 'doing',
                                acceptIds: [300],
                            },
                            {
                                id: 300,
                                name: 'todo1',
                                acceptIds: [400],
                            },
                            {
                                id: 400,
                                name: 'todo2',
                                acceptIds: [500],
                            },
                            {
                                id: 500,
                                name: 'todo3',
                                acceptIds: [600],
                            },
                            {
                                id: 600,
                                name: 'todo4',
                                acceptIds: [500],
                            },
                        ]
                    })
                }, 2000);
            })
        }

        return new Promise((resolve, reject) => {
            setTimeout(() => {

                const {maxResults, startIndex} = data;
                let record = [];
                for (let i = startIndex; i < (startIndex + maxResults); i++) {
                    record.push({id: i, name: '用户' + i, age: 123})
                }
                resolve({
                    status: 200, data: {
                        resultCount: 100, maxResults: maxResults,
                        records: record
                    }
                })
            }, 2000);
        })
    },
};
const service = {
    pageFindByFinderCode: (data) => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                let {searchText, startIndex, maxResults} = data;
                console.log('searchText', searchText)
                let res = [];
                if (searchText) {
                    resolve({
                        status: 200, data: {
                            results: res,
                            maxResults: res.length,
                            resultCount: 0,
                        }
                    })
                } else {
                    for (let i = 0; i < maxResults; i++) {
                        let obj = {key: i + 1, id: startIndex + i + 1, name: '用户' + (startIndex + i + 1)};
                        res.push(obj)
                    }
                    resolve({
                        status: 200, data: {
                            results: res,
                            maxResults: res.length,
                            resultCount: 200,
                        }
                    })
                }

            }, 2000);
        })
    },
    objectBoxFetch: (data) => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                let {startIndex = 0, maxResults = 40} = data;
                console.log(data);
                let res = [];
                for (let i = startIndex; i < startIndex + maxResults; i++) {
                    let obj = {key: i + 1, id: i + 1, name: '用户' + (i + 1), code: 10 + i + `${i + 1}`, state:i > 20 && 100 || 200};
                    res.push(obj)
                }
                resolve({
                    status: 200, data: {
                        records: res,
                        maxResults: maxResults,
                        resultCount: 400,
                    }
                })
            }, 300)
        })
    }
};

export default class Test extends React.Component {

    dataComp = [
        {
            compLabel: '查找器',
            componentType: ComponentType.FINDER,
            fieldName: 'object.id',
        },
        {
            compLabel: '查找器1',
            componentType: ComponentType.FINDER,
            fieldName: 'object1.id',
            needBetween: true, // 需要“介于”
            defaultFilterCode: filterCodes.between.code,
            valueCompProps: {
                onRef: (ins) => {
                    console.log('ins', ins);
                    if (ins && ins.addEditBeforeHandler) {
                        ins.addEditBeforeHandler((fIns) => {
                            fIns.filter = new QueryFilter(QueryFilter.AND);
                            fIns.filter.andEqual('name', 'sss');
                            console.log('beforeCb', fIns);
                        })
                    }
                }
            }
        },
        {
            componentType: ComponentType.COMBO_BOX,
            fieldName: 'combo',
            compLabel: '枚举',
        },
        {
            componentType: ComponentType.CALENDAR,
            fieldName: 'date',
            compLabel: '选择时间',
            // format: 'YYYY-MM-DD'
        },
        {
            componentType: ComponentType.TEXT_INPUT,
            fieldName: 'text',
            compLabel: '文本',
        },
        {
            componentType: ComponentType.NUMBER_INPUT,
            fieldName: 'number',
            format: '$',
            floatNum: 5,
            compLabel: '数字',
        },
        {
            componentType: ComponentType.CHECK_BOX,
            fieldName: 'checkbox',
            compLabel: '开关',
        },
        {
            componentType: ComponentType.TAG_EDITOR,
            fieldName: 'tag',
            compLabel: '标签',
        },
    ];

    state = {
        openMultiActModal: false
    };

    render() {
        const qtConfig = {
            appCode: 'USER',
            filterConfig: this.dataComp,
            fetchList: service.objectBoxFetch,
            colsConf: [
                {name: 'id', remark: 'ID', colWidth: 100},
                {name: 'code', remark: '编码', colWidth: 100},
                {name: 'name', remark: '名称', colWidth: 100},
                {name: 'age', remark: '年龄', colWidth: 100}
            ],
            rowSelect: false,
            customQueryConf: (queryConf) => {
                queryConf.filter.andEqual('dataStatus', DataStatus.DISABLED);
            },
            // searchProps:{defaultOpen: true}
            // isSearchInput:false
        };

        return <>
            <GlobalProvider request={request}>
                <h2>QueryTable</h2>
                <QueryTable
                    style={{height: '400px'}}
                    {...qtConfig}
                    selecting={true}
                    rowSelect={true}
                    multi={false}
                    searchProps={{
                        activityVisible: true
                    }}
                    onRef={(ins) => {
                        this.qtIns = ins;
                        if(ins.setRowHandlers) {
                            ins.setRowHandlers({
                                onDoubleClick: (record) => {
                                    console.log('onDbClick', record);
                                }
                            })
                        }
                    }}
                />
                <hr/>
                <h2>MultiActModal</h2>
                <MultiActModal
                    title={'批量操作'}
                    visible={this.state.openMultiActModal}
                    qtConfig={qtConfig}
                    // loading={true}
                    // loadingComp={<TaskProgress />}
                    // actButtons={['selected']}
                    onCancel={() => {
                        this.setState({openMultiActModal: false});
                    }}
                    onActBySelected={(selectedRows) => {
                        return new Promise(resolve => {
                            sleepFunc(2000).then(() => {
                                resolve({status: 200})
                            });
                        })
                    }}
                    onActByFilter={(ajaxData) => {
                        return new Promise(resolve => {
                            sleepFunc(20000).then(() => {
                                resolve({status: 200})
                            });
                        })
                    }}
                />
                <Button onClick={() => this.setState({openMultiActModal: true})}>打开 MultiActModal</Button>
            </GlobalProvider>
        </>
    }
}

